<template>
  <view>
    <view v-if="vuex_loginStatus">
      <u-sticky>
        <TopTabs
          :list-data="statusList"
          key-name="name"
          :current.sync="current"
          @tabClick="orderStatusClick"
        />
      </u-sticky>
      <basePage :show-tabbar="true" :page-params="pageParams">
        <!--        <view @click="test">测试测试测试</view>-->
        <view
          class="order-list"
        >
          <!-- 加载更多-->
          <order-list
            :order-res-data="orderResData"
            :date="curDate"
            @itemsDetail="itemsDetail"
            @getOrderListFn="orderStatusClick([])"
          />
          <view class="u-p-b-40">
            <u-loadmore :status="status" />
          </view>
        </view>
      </basePage>
    </view>
    <!-- 未登录显示 -->
    <view v-else>
      <basePage :show-tabbar="true" :page-params="pageParams">
        <view class="login">
          <text>亲，您还没有登录哦～</text>
          <text class="button" @tap="onLoginButtonClick">登录</text>
        </view>
      </basePage>
    </view>
    <!-- 登录弹框 -->
    <u-popup :show="showPopVisible" :round="5" mode="bottom" height="420" @close="closePop">
      <RegisterPop @closePopFn="closePop" />
    </u-popup>
  </view>
</template>

<script>
/*订单状态
*   SAVED(0,"已保存"),
    WAIT_PAY(10,"待付款"),
    WAIT_CHECK(20,"待审核"),
    SAVED_CANCEL(29,"已取消"),
    WAIT_OUT(30,"待出库"),
    PART_OUT(35,"部分出库"),
    WAIT_SEND(40,"待发货"),//完全出库
    PART_SEND(45,"部分发货"),
    WAIT_RECEIVE(50,"待收货"),//完全发货
    PART_RECEIVE(55,"部分收货"),
    WAIT_SETTLE(60,"已收货待结算"),//完全收货
    ORDER_SUCCESS(70,"订单成功"),
    TRADE_FINISH(80,"交易完成"),
    ORDER_CANCEL(90,"订单取消"), //110=>交易关闭
    TRADE_CLOSE(100,"交易关闭"), //110=>交易关闭
    //逆向订单
    REVERSE_ORDER_WAIT_CHECK(110,"退单待审核"),
    REVERSE_ORDER_RETURN_GOODS(120,"退单退货处理"),
    REVERSE_ORDER_REFUND(130,"退单退款处理"),
    REVERSE_ORDER_FINISH(140,"已完成"),//退单已完成*/
import basePage from '@/components/base-page';
import TopTabs from '@/components/top-tabs';
import OrderList from '@/components/order-list/order-list';
import { postOrderList } from '@/api/orderApi';
import RegisterPop from '@/components/register-pop';
import { loginMixin } from '@/login/loginMixin';
import { queryCreditLinesFn, getSystemTime, formatDate } from '@/common/common';
export default {
  name: 'Index',
  components: {
    TopTabs,
    OrderList,
    RegisterPop,
    basePage
  },
  mixins: [loginMixin],
  data() {
    return {
      orderResData: [],
      current: 0,
      statusList: [
        {
          name: '全部',
          code: [],
        },
        {
          name: '待处理',
          code: [10],
        },
        {
          name: '待出库',
          code: [30],
        },
        {
          name: '待发货',
          code: [35, 40],
        },
        {
          name: '待收货',
          code: [45, 50, 55]
        },
        {
          name: '待结算',
          code: [60],
        },
        {
          name: '订单成功',
          code: [70],
        },
        {
          name: '交易完成',
          code: [80],
        },
        {
          name: '订单取消',
          code: [90],
        },
        {
          name: '交易关闭',
          code: [100],
        }
      ],
      page: 1,
      pageSize: 20,
      orderStatus: [],
      status: 'loading',
      showPopVisible: false,
      pageParams: {
        // state: '',
        emptyTitle: '一个订单都没有哦～',
        errorTitle: '请求失败',
        showButton: false
      },
      curDate: '',
      // creditLines: 0,
    }
  },
  watch: {
    vuex_loginStatus: {
      handler(newVal) {
        if (newVal) {
          this.orderStatusClick([])
        }
      }
    }
  },
  onShow() {
    if (this.vuex_loginStatus && this.vuex_accountInfo && this.vuex_accountInfo.loginAccount) {
      console.log(this.current);
      this.page = 1
      this.loadDataFn(this.statusList[this.current])
    }
  },
  onReachBottom() {
    if (this.pageParams.state == 'EMPTY') {
      this.page = 1
    } else {
      this.page++
    }
    this.addList()
  },
  onPullDownRefresh: function() {
    this.page = 1
    this.orderResData = []
    this.addList()
  },
  methods: {
    /*test() {
      this.$u.vuex('vuex_accountInfo', null)
    },*/
    loadDataFn(orderStatus) {
      this.orderStatusClick(orderStatus || null)
      this.getAccountTimeFn()
    },
    orderStatusClick(item) {
      this.orderResData = []
      this.orderStatus = item ? item.code : []
      this.page = 1
      this.addList()
    },
    addList() {
      this.status = 'loading'
      this.$delete(this.pageParams, 'state')
      // post请求
      const params = { 'orderStatus': this.orderStatus, 'pageNum': this.page, 'pageSize': this.pageSize }
      postOrderList(params).then((res) => {
        if (res.data != null) {
          if (res.data.result.length != 0) {
            /*列表页不根据信用额度将去确认按钮置灰
            res.data.result.map((item) => {
              if (item.auditStatus == 0 && item.xdAccount == this.vuex_accountInfo.loginAccount && item.settleType == 1201 && item.orderStatus == 10 && (item.billDate == this.curDate || this.setFormatDate(item.billDate) == this.curDate)) {
                item.creditLines = this.queryCreditLinesFn(item.customerCode)
              }
              return item
            })*/
            if (this.page == 1) {
              this.orderResData = res.data.result
            } else {
              this.orderResData.push(...res.data.result)
            }
            if (res.data.totalRecord <= 20) {
              this.status = 'nomore'
            }
          } else if (this.page == 1 && res.data.result.length == 0) {
            this.status = ''
            this.pageParams.state = 'EMPTY'
          } else {
            this.status = 'nomore'
          }
          uni.stopPullDownRefresh();
        } else {
          this.status = ''
          this.pageParams.state = 'EMPTY'
        }
      }).catch(() => {
      })
    },
    /*获取时间*/
    async getAccountTimeFn() {
      const time = await getSystemTime()
      this.curDate = formatDate(new Date(time), 'yyyy-mm-dd')
      console.log(this.curDate);
    },
    setFormatDate(time) {
      const orderNextTime = formatDate(new Date(new Date(time).getTime() + (24 * 60 * 60 * 1000)), 'yyyy-mm-dd')
      return orderNextTime
    },
    /*获取可用额度*/
    async queryCreditLinesFn(customerNumber) {
      const params = {
        'customerNumber': customerNumber
      }
      const creditLinesData = await queryCreditLinesFn(params)
      return creditLinesData[0].internal_credit_data.internal_credit_avail
    },
    onLoginButtonClick() {
      const callbackUrl = `/pages/order/index`
      uni.navigateTo({
        url: `../../login/login/codeLogin?type=order&callbackUrl=${callbackUrl}`
      })
      // this.loginEvent(null, 'order');
    }
  }
}
</script>

<style scoped lang="scss">

page {
  background-color: #f8f8f8;
}

.login {
  display: flex;
  align-items: center;
  padding-top: 28px;
  flex-direction: column;
  background-color: white;
  font-size: 16px;
  color: #333333;
  text-align: center;
  font-weight: 400;
}

.button {
  width: 92px;
  height: 24px;
  margin-top: 28px;
  margin-bottom: 36px;
  background:$uni-orange;
  border-radius: 12px;
  font-size: 12px;
  color: #fff;
  text-align: center;
  align-items: center;
  justify-content: center;
  display: flex;
}
</style>
